<div class="easyui-layout" data-options="fit:true">

    <!-- 查询 -->
    <div data-options="region:'north',border:false" style="height:50px;width: 1200px;padding:5px">
        <form id="accBookItem_query_form" style="height:50px;width: 1200px">
            书名： <input class="easyui-textbox" id="accBookItem_query_form_name" name="name"/>
            类型： <input id="accBookItem_query_form_type_id" name="type_id" style="width:100px"/>
            作者： <input id="accBookItem_query_form_author_id" name="author_id" style="width:100px"/>
            状态： <input id="accBookItem_query_form_status" name="status" style="width:90px"/>
            创建时间：<input class="easyui-datebox" data-options="editable:false,required:false,validType:'date'"
                        id="accBookItem_query_form_date_start" name="date_start" style="width: 120px;"/>
            至：<input class="easyui-datebox" data-options="editable:false,required:false,validType:'date'"
                     id="accBookItem_query_form_date_end" name="date_end" style="width: 120px;"/>

            <a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-search'"
               onclick='accBookItemQuery();'>查询</a>
            <a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-clear'"
               onclick='accBookItemQueryClear();'>重置</a>
            <a href="javascript:void(0);" class="easyui-linkbutton" data-options="iconCls:'icon-add'"
               onclick='accBookItemAdd();'>新增</a>
        </form>
    </div>

    <!--        图书列表-->
    <div data-options="region:'center'" style="border:0;padding:5px;overflow:hidden;">
        <div style="width:1200px;height:100%;overflow:auto;border:1px solid #ccc;float:left">
            <table id="accBookItem_bookItem_grid"></table>
        </div>
    </div>
</div>

<!--编辑图书-->
<div id="accBookItem_edit_dialog">
    <form id="accBookItem_edit_form" method="post">
        <table style="margin-bottom:20px;width:100%">
            <tr>
                <td><input type="hidden" id="accBookItem_edit_form_id" name="id"/></td>
            </tr>
            <tr>
                <td style="text-align: right;">书名:</td>
                <td><input id="accBookItem_edit_form_name" name="name" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">类型:</td>
                <td><input id="accBookItem_edit_form_type_id" name="type_id" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">作者:</td>
                <td><input id="accBookItem_edit_form_author_id" name="author_id" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">状态:</td>
                <td><input id="accBookItem_edit_form_status" name="status" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">出版社:</td>
                <td><input id="accBookItem_edit_form_publisher" name="publisher" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">备注:</td>
                <td><input id="accBookItem_edit_form_remark" name="remark" class="easyui-textbox" required/></td>
            </tr>
        </table>
    </form>
</div>

<!--新增图书-->
<div id="accBookItem_add_dialog">
    <form id="accBookItem_add_form" method="post">
        <table style="margin-bottom:20px;width:100%">
            <tr>
                <td style="text-align: right;">书名:</td>
                <td><input id="accBookItem_add_form_name" name="name" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">类型:</td>
                <td><input id="accBookItem_add_form_type_id" name="type_id" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">作者:</td>
                <td><input id="accBookItem_add_form_author_id" name="author_id" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">出版社:</td>
                <td><input id="accBookItem_add_form_publisher" name="publisher" class="easyui-textbox" required/></td>
            </tr>
            <tr>
                <td style="text-align: right;">备注:</td>
                <td><input id="accBookItem_add_form_remark" name="remark" class="easyui-textbox" required/></td>
            </tr>
        </table>
    </form>
</div>

<script>
    $(function () {
        initBookItemComponents();
        initBookItemGrid();
    });

    function initBookItemComponents() {
        $("#accBookItem_edit_form_type_id").combogrid({
            url: '/queryBookTypes',
            idField: 'id', textField: 'name',
            panelWidth: 160, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '类型', width: 100}
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $("#accBookItem_edit_form_author_id").combogrid({
            url: '/queryBookAuthors',
            idField: 'id', textField: 'name',
            panelWidth: 210, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '姓名', width: 100},
                    {field: 'sex', title: '性别', width: 50,
                        formatter: function (value, row, index) {
                            if (value === 0) {
                                return '女';
                            } else if (value === 1) {
                                return '男';
                            } else {
                                return '';
                            }
                        }
                    }
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $('#accBookItem_edit_form_status').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 70, editable: false,
            data: [
                {"id": 1, "text": "可用"},
                {"id": 0, "text": "不可用"}
            ]
        });

        $("#accBookItem_add_form_type_id").combogrid({
            url: '/queryBookTypes',
            idField: 'id', textField: 'name',
            panelWidth: 160, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '类型', width: 100}
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $("#accBookItem_add_form_author_id").combogrid({
            url: '/queryBookAuthors',
            idField: 'id', textField: 'name',
            panelWidth: 210, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '姓名', width: 100},
                    {field: 'sex', title: '性别', width: 50,
                        formatter: function (value, row, index) {
                            if (value === 0) {
                                return '女';
                            } else if (value === 1) {
                                return '男';
                            } else {
                                return '';
                            }
                        }
                    }
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $("#accBookItem_query_form_type_id").combogrid({
            url: '/queryBookTypes',
            idField: 'id', textField: 'name',
            panelWidth: 160, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '类型', width: 100}
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $("#accBookItem_query_form_author_id").combogrid({
            url: '/queryBookAuthors',
            idField: 'id', textField: 'name',
            panelWidth: 210, panelHeight: 200,
            editable: true, mode: 'remote',
            columns: [
                [
                    {field: 'id', title: '编号', width: 50},
                    {field: 'name', title: '姓名', width: 100},
                    {field: 'sex', title: '性别', width: 50,
                        formatter: function (value, row, index) {
                            if (value === 0) {
                                return '女';
                            } else if (value === 1) {
                                return '男';
                            } else {
                                return '';
                            }
                        }
                    }
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onClickRow: function (value, row, index) {}
        });

        $('#accBookItem_query_form_status').combobox({
            valueField: 'id', textField: 'text',
            panelHeight: 99, editable: false,
            data: [
                {"id": 2, "text": "全部", selected: true},
                {"id": 1, "text": "可用"},
                {"id": 0, "text": "不可用"}
            ]
        });

        $('#accBookItem_add_form_name').textbox({
            invalidMessage: '书名已存在',
            validType: {
                // 请求服务器，校验用户名是否可用
                remote:['/verifyBookItemName', 'name']
            }
        });
    }
    
    function initBookItemGrid() {
        $('#accBookItem_bookItem_grid').datagrid({
            url: '/queryAllSysBooks',
            idField: 'id',
            // fitColumns: true,
            fit: true, scrollbarSize: 1, striped: true,
            checkOnSelect: false, selectOnCheck: false, singleSelect: true,
            pagination: true, pageSize: 15, pageList : [15, 30, 60 ],
            columns: [
                [
                    {field: 'id', title: '编码', width: 50, align: 'center', halign: 'center'},
                    {field: 'name', title: '书名', width: 150, align: 'center', halign: 'center'},
                    {field: 'type_name', title: '类型', width: 100, align: 'center', halign: 'center'},
                    {field: 'author_name', title: '作者', width: 100, align: 'center', halign: 'center'},
                    {field: 'status', title: '状态', width: 70, align: 'center', halign: 'center',
                        formatter: function (value, row, index) {
                            if (value === 1) {
                                return '可用';
                            } else if (value === 0) {
                                return '不可用';
                            } else {
                                return '';
                            }
                        }
                    },
                    {field: 'publisher', title: '出版社', width: 150, align: 'center', halign: 'center'},
                    {field: 'remark', title: '备注', width: 180, align: 'center', halign: 'center'},
                    {field: 'ctime', title: '创建时间', width: 180, align: 'center', halign: 'center'},
                    {field: 'x', title: '操作', width: 100, align: 'center', halign: 'center',
                        formatter: function (value, row, index) {
                            return '<a href="javascript:void(0)" onclick="updateBookItemButton(' + row.id + ')">编辑</a>' +
                                '<a href="javascript:void(0)" onclick="deleteBookItemButton(' + row.id + ')">|删除</a>';
                        }
                    }
                ]
            ],
            loadFilter: function (data) {
                if (data.data) return data.data;
                else return data;
            },
            onLoadSuccess: function (node, data) {},
            onClickRow: function (index, row) {}
        });
    }

    // 编辑图书
    function updateBookItemButton(book_id) {
        $('#accBookItem_bookItem_grid').datagrid("selectRecord", book_id);
        var book = $('#accBookItem_bookItem_grid').datagrid("getSelected");
        if (!book) {
            $.messager.alert("提示", "请选择要编辑的图书！", 'info');
            return;
        }

        // 加载编辑图书内容
        $("#accBookItem_edit_form").form('load', {
            id: book.id,
            name: book.name,
            type_id: book.type_id,
            author_id: book.author_id,
            status: book.status,
            publisher: book.publisher,
            remark: book.remark
        });

        // 当作者特别多少，就不能加载所有的作者，后端会有 LIMIT
        // 所以作者需要设置一下，防止该作者没有加载过来
        $('#accBookItem_edit_form_author_id').combogrid('setValue', {
            id:book.author_id,
            name:book.author_name
        });

        $('#accBookItem_edit_dialog').dialog({
            title: '编辑图书', iconCls: 'icon-edit',
            width: 380, height: 350, modal: true, shadow: true,
            onClose: function () {
                $('#accBookItem_edit_form').form('clear').form('reset');
            },
            buttons: [
                {
                    id: 'accBookItem_edit_dialogsave',
                    text: '保存', iconCls: 'icon-save',
                    handler: updateBookItem
                }, {
                    id: 'accBookItem_edit_dialogclose',
                    text: '关闭', iconCls: 'icon-clear',
                    handler: function () {
                        $("#accBookItem_edit_dialog").dialog("close");
                    }
                }
            ]
        });
    }

    function updateBookItem() {
        if (!$('#accBookItem_edit_form').form('validate')) {
            return;
        }

        $('#accBookItem_edit_form').form('submit', {
            url: '/updateBookItem',
            ajax: true,
            onSubmit: function () {},
            success: function (data) {
                data = JSON.parse(data);

                if (data.code !== 200) {
                    $.messager.alert("提示", "图书更新失败！", 'info');
                    return;
                }

                $.messager.show({title: '提示', msg: '图书更新成功！', timeout: 2000, showType: 'slide'});

                $("#accBookItem_edit_dialog").dialog("close");
                $("#accBookItem_bookItem_grid").datagrid("reload");
            }
        });
    }

    // 新增图书
    function accBookItemAdd() {
        $('#accBookItem_add_dialog').dialog({
            title: '新增图书', iconCls: 'icon-add',
            width: 380, height: 350, modal: true, shadow: true,
            onClose: function () {
                $('#accBookItem_add_form').form('clear').form('reset');
            },
            buttons: [
                {
                    id: 'accBookItem_add_dialogsave',
                    text: '保存', iconCls: 'icon-save',
                    handler: addBookItem
                }, {
                    id: 'accBookItem_add_dialogclose',
                    text: '关闭', iconCls: 'icon-clear',
                    handler: function () {
                        $("#accBookItem_add_dialog").dialog("close");
                    }
                }
            ]
        });
    }
    
    function addBookItem() {
        if (!$('#accBookItem_add_form').form('validate')) {
            return;
        }

        $('#accBookItem_add_form').form('submit', {
            url: '/addBookItem',
            ajax: true,
            onSubmit: function () {},
            success: function (data) {
                data = JSON.parse(data);

                if (data.code !== 200) {
                    $.messager.alert("提示", "新增图书失败！", 'info');
                    return;
                }

                $.messager.show({title: '提示', msg: '新增图书成功！', timeout: 2000, showType: 'slide'});

                $("#accBookItem_add_dialog").dialog("close");
                $("#accBookItem_bookItem_grid").datagrid("reload");
            }
        });
    }

    function deleteBookItemButton(book_id) {
        $.messager.confirm('确认', '您确认想要删除该条目吗？', function (r) {
            if (!r) {return;}

            $.ajax({
                url: '/deleteBookItemById',
                type: "post",
                data: {id: book_id},
                dataType: "json",
                async: false,
                success: function (data) {
                    if (data.code !== 200) {
                        $.messager.alert("提示", data.message, 'info');
                        return;
                    }

                    $.messager.show({title: '提示', msg: '删除条目成功！', timeout: 2000, showType: 'slide'});
                    $("#accBookItem_bookItem_grid").datagrid("reload");
                }
            });
        });
    }

    function accBookItemQuery() {
        $("#accBookItem_bookItem_grid").datagrid('load', {
            name:$('#accBookItem_query_form_name').val(),
            type_id:$('#accBookItem_query_form_type_id').val(),
            author_id:$('#accBookItem_query_form_author_id').val(),
            status:$('#accBookItem_query_form_status').val(),
            date_start:$('#accBookItem_query_form_date_start').val(),
            date_end:$('#accBookItem_query_form_date_end').val()
        });
    }

    function accBookItemQueryClear() {
        $('#accBookItem_query_form_name').textbox('clear');
        $('#accBookItem_query_form_type_id').combogrid('clear');
        $('#accBookItem_query_form_author_id').combogrid('clear');
        $('#accBookItem_query_form_status').combobox('setValue', 2);
        $('#accBookItem_query_form_date_start').datebox('clear');
        $('#accBookItem_query_form_date_end').datebox('clear');
        $("#accBookItem_bookItem_grid").datagrid('load', {
            name: null,
            type_id: null,
            author_id: null,
            status: null,
            date_start: null,
            date_end: null
        });
    }
</script>